import { createApp } from "../lib/app";
import { GeoBounds, MapOpenWay, MapProvider, MapViewEntity, openMapDarkStyle } from "vjmap3d";
import { env } from "./env";
import { openMapLightStyle } from "vjmap";
import { initButtonGroup } from "./ui";
import { loadDataScene } from "./tube";
export const initMap3d = async () => {
    let containerId = "map3dContainer";
    // @ts-ignore
    document.getElementById(containerId).style.background = env.background || (env.darkTheme ? "#2c3e50" : "rgb(200, 211, 220)")
    const app = createApp(containerId);

    let res = await app.svc.openMap({
        mapid: env.mapId, // 地图ID,(请确保此ID已存在，可上传新图形新建ID)
        version: env.version,
        // @ts-ignore
        mapopenway: env.mapopenway || MapOpenWay.GeomRender, // 以几何数据渲染方式打开
        style: env.darkTheme ? openMapDarkStyle() : openMapLightStyle() 
    });
    if (res.error) {
        console.error(res.error);
        return;
    }
    // 获取当前地图的可视范围
    let clipPolygon: any = GeoBounds.fromString(res.drawBounds).toPointArray();
    let provider = new MapProvider(
        [
            {
                url: app.svc.rasterTileUrl()
            }
        ],
        {
            // @ts-ignore
            transparent: true
        }
    );

    let mapBounds = GeoBounds.fromString(res.bounds)
    let scale = 100;
    let mapviewEnt = new MapViewEntity({
        provider,
        baseScale: scale,
        // @ts-ignore
        mapBounds: mapBounds.toArray(),
        clipPolygon //  如果透明的话，不能使用裁剪区载
    });
    mapviewEnt.addTo(app);
    
    if (env.dataId) {
        loadDataScene(app, env.dataId)
    }

    await initButtonGroup(app, !!env.dataId)

    return app;
};
